<template>
 <div class="block" style="padding:0 0 0; ">
  <header class="header-nav">
      <span style="font-size: 15px;font-weight: bold;color: #000">当前位置：</span>
      <template v-for="(item, index) in nvaDatas"> 
         <span v-if="index===nvaDatas.length-1" class="seprator">{{item.name}}</span>
         <template v-else>
            <span v-on:click="backNav(item)">{{item.name}}</span>
            <span class="seprator" style="font-size:9px;"><i class="el-icon-arrow-right"></i></span>
         </template>
      </template>
  </header>
  <div class="test"></div>
  </div>
</template>

<script>
export default {
  data(){
    return{

    }
  },
  props:{
     nvaDatas:{
       type:Array,
       default:function(){
          return [];
       }
     },
     titleText:{
        type:String,
       default:function(){
          return '测试';
       }
     }
  },
  methods:{
    backNav(item){
      // console.log(item)
       this.$emit("backNav",item);
    }
  }
}
</script>
<style lang="less" scoped>
 .header-nav{
     white-space: nowrap;
    // color:#20a0ff;
    border-bottom: 1px solid #DFE6EC;
    border-radius: 3px;
    height: 40px;
    margin-left: 10px;
    width: 97.8%;
    line-height: 40px;
    margin-bottom:10px;
    overflow-x: auto;
  span{
       color:#66B3FF;
       font-size: 15px;
       cursor: pointer;
  }
  span.seprator{
     color:#8E8E8E;
     cursor: default;
  }
}
</style>
